<!--
 * @Descripttion : 
 * @Autor        : Lilong
 * @Date         : 2022-09-30 11:46:30
 * @LastEditTime : 2022-10-01 06:01:19
 * @FilePath     : \表单控件绑定\v-model和组件\第二种(用于自定义输入组件上)\使用默认的属性名称\配合计算属性一起使用\第一种：v-model和defineComponent\CustomInput.vue
-->
<script lang="ts">
  import { computed, defineComponent } from "vue";
  
  export default defineComponent({
      name: 'CustomInput',
      props: ['modelValue'],  //默认是这个属性 modelValue
      emits: ['update:modelValue'], //默认是这个触发事件名称
      setup(props, context) {
          const valueComputed = computed({
              get: () => props.modelValue,
              set: (value) => {
                  context.emit('update:modelValue', value)
              }
          })
  
          return {
              valueComputed
          }
      }
  })
  </script>
        
  <template>
      <input v-model="valueComputed"/>
  </template>